﻿@{
    ViewData["Title"] = "参数";

}

<!-- Start Content-->
<div class="container-fluid">

    <!-- start page title -->
    <div class="row">
        <div class="col-12">
            <div class="page-title-box">
                <div class="page-title-right">

                    <ol class="breadcrumb m-0">
                        <li class="breadcrumb-item"><a href="javascript: void(0);"><i class="fa fa-map-marker-alt"></i></a></li>
                        <li class="breadcrumb-item"><a href="javascript: void(0);">参数</a></li>
                        <li class="breadcrumb-item active">/</li>
                    </ol>
                </div>
                <h4 class="page-title">参数</h4>
            </div>
        </div>
    </div>
    <!-- end page title -->

    <div class="row">
        <div class="col-12">
            <div class="card-box">

                <button onclick="ShowPopup('/CodeManager/AddEdit/')" type="button" class="btn btn-primary  waves-effect waves-light float-right ladda-button" data-style="expand-left">
                    新增参数
                </button>


                <h4 class="header-title mb-4">参数管理</h4>

                <table class="table table-hover m-0 table-centered dt-responsive nowrap w-100" id="datatable">
                    <thead>
                        <tr>

                            <th>类型</th>
                            <th>名字</th>
                            <th>值</th>
                            <th>值2</th>
                            <th>值3</th>
                            <th>状态</th>
                            <th>备注</th>
                            <th>建立日期</th>

                            <th class="hidden-sm">Action</th>
                        </tr>
                    </thead>

                    <tbody>
                    </tbody>
                </table>
            </div>
        </div><!-- end col -->
    </div>


</div> <!-- container -->


<div id="modalDefault" class="modal fade" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true" style="display: none;">
    <div class="modal-dialog">
        <div class="modal-content">

        </div>
    </div>
</div><!-- /.modal -->

@section Scripts{
    @await Html.PartialAsync("_ValidationScriptsPartial")
    <script src="~/assets/libs/moment/moment.min.js"></script>

    <script>


        var table;

        $(function () {

            table = $('#datatable').DataTable({
                "oLanguage": {
                    "sLengthMenu": "每页显示 _MENU_ 条记录",
                    "sZeroRecords": "对不起，没有匹配的数据",
                    "sInfo": "第 _START_ - _END_ 条 / 共 _TOTAL_ 条数据",
                    "sInfoEmpty": "没有匹配的数据",
                    "sInfoFiltered": "(数据表中共 _MAX_ 条记录)",
                    "sProcessing": "正在加载中...",
                    "sSearch": "全文搜索：",
                    "oPaginate": {
                        "sFirst": "第一页",
                        "sPrevious": " 上一页 ",
                        "sNext": " 下一页 ",
                        "sLast": " 最后一页 "
                    }
                },
                language: {
                    paginate:
                        { previous: "<i class='mdi mdi-chevron-left'>", next: "<i class='mdi mdi-chevron-right'>" }
                },
                drawCallback: function () { $(".dataTables_paginate > .pagination").addClass("pagination-rounded") },

                "responsive": true,
                "lengthChange": true,
                "searching": false,
                "order": [[0, 'asc']],
                "aoColumnDefs": [{ "bSortable": false, "aTargets": [1, 2, 3, 4, 5, 6, 7] }],
                "serverSide": true,
                ajax: {
                    url: '/CodeManager/GetAll',
                    type: 'POST',
                    async: true,
                    data: function (data) {

                        return {
                            param: data
                        };
                    },
                    error: function (jqXHR) {
                        HandleGlobalException(jqXHR);

                    }
                },

                columns: [
                    {
                        title: "类型",
                        data: "Category",
                        name: "Category",

                    },
                    {
                        title: "名字",
                        data: "Name",
                        name: "Name"
                    },
                    {
                        title: "值",
                        data: "Value",
                        name: "Value"
                    },
                    {
                        title: "值2",
                        data: "Value2",
                        name: "Value2"
                    },
                    {
                        title: "值3",
                        data: "Value3",
                        name: "Value3"
                    },

                    {
                        title: "备注",
                        data: "Remark",
                        name: "Remark"
                    },
                    {
                        title: "状态",
                        data: "Status",
                        name: "Status",
                        render: function (data, type, row) {

                            if (data == 1) {
                                return "<span class='badge badge-success'>有效</span>"
                            }
                            else {
                                return "<span class='badge badge-dark'>失效</span>"
                            }
                        }
                    },
                    {
                        title: "建立日期",
                        data: "CreatedTime",
                        name: "CreatedTime",
                        render: function (data, type, row) {
                            return window.moment(data).format("YYYY-MM-DD HH:mm:ss");
                        }
                    },
                    {
                        title: "",
                        data: null,
                        name: null,
                        render: function (data, type, row) {

                            var html = "<div class='btn-group dropdown'>" +
                                "<a href='javascript: void(0);' class='table-action-btn dropdown-toggle arrow-none btn btn-outline-secondary waves-effect btn-sm' data-toggle='dropdown' aria-expanded='false'><i class='ti-menu'></i></a>" +
                                "<div class='dropdown-menu dropdown-menu-left'>" +
                                "<a class='dropdown-item' href='#' onclick='ShowPopup(\"/CodeManager/AddEdit/" + row["ID"] + "\")'><i class='mdi mdi-pencil mr-2 text-muted font-18 vertical-middle'></i>修改</a>";

                            if (row["Status"] == 1) {
                                html = html + "<a class='dropdown-item' href='#' onclick='UpdateStatus(\"" + row["ID"] + "\")'><i class='mdi mdi-playlist-remove mr-2 text-muted font-18 vertical-middle'></i>标记为失效</a>";
                            } else {
                                html = html + "<a class='dropdown-item' href='#' onclick='UpdateStatus(\"" + row["ID"] + "\")'><i class='mdi mdi-check mr-2 text-muted font-18 vertical-middle'></i>标记为有效</a>";
                            }

                            html = html + "<a class='dropdown-item' href='#' onclick='Remove(\"" + row["ID"] + "\")'><i class='mdi mdi-delete-forever mr-2 text-muted font-18 vertical-middle'></i>删除</a></div></div>";

                            return html;

                        }
                    }

                ]


            });
        });


        function ShowPopup(url) {
            var modalId = 'modalDefault';
            var modalPlaceholder = $('#' + modalId + ' .modal-dialog .modal-content');
            $.get(url)
                .done(function (response) {
                    modalPlaceholder.html(response);
                    popup = $('#' + modalId + '').modal({
                        keyboard: false,
                        backdrop: 'static'
                    });
                }) ;
        }


        function SubmitAddEdit(form) {
            $(form).removeData('validator');
            $(form).removeData('unobtrusiveValidation');
            $.validator.unobtrusive.parse(form);
            if ($(form).valid()) {
                var data = $(form).serializeJSON();
                data = JSON.stringify(data);

                $.ajax({
                    type: 'POST',
                    url: '/CodeManager/Save',
                    data: data,
                    contentType: 'application/json',
                    success: function (data) {
                        if (data.success) {
                            popup.modal('hide');
                            ShowMessage(data.message);
                            if (table) {
                                table.draw();
                            }

                        } else {
                            ShowMessageError(data.message);
                        }
                    } 
                });

            }
            return false;
        }

        function Remove(id) {


            Swal.fire({
                title: "删除",
                text: "确定删除?",
                type: "warning",
                showCancelButton: true,
                confirmButtonColor: "#dd4b39",
                confirmButtonText: "是的，删除!",
                cancelButtonText: "取消",

            }).then(function () {
                $.ajax({
                    type: 'POST',
                    url: '/CodeManager/Delete/' + id,
                    success: function (data) {
                        if (data.success) {
                            ShowMessage(data.message);
                            table.draw();
                        } else {
                            ShowMessageError(data.message);
                        }
                    } 
                });
            });


        }

        function UpdateStatus(id) {

            $.ajax({
                type: 'POST',
                url: '/CodeManager/ChangeStatus/' + id,
                success: function (data) {
                    if (data.success) {
                        ShowMessage(data.message);
                        table.draw();
                    } else {
                        ShowMessageError(data.message);
                    }
                } 
            });



        }
    </script>
}
